;(function() {
    // 步骤3：创建echarts实例
    let myChart = echarts.init(document.querySelector('.column1 .box2'))

    // 步骤4：定义配置（指定图表的配置项和数据）
    let option = {
        title: {
          text: ''
        },
        tooltip: {
          trigger: 'item',
          formatter: '{a} <br/>{b} : {c}%'
        },
        toolbox: {
          feature: {
            dataView: { readOnly: false },
            restore: {},
            saveAsImage: {}
          }
        },
        legend: {
          data: ['Show', 'Click', 'Visit', 'Inquiry', 'Order']
        },
        series: [
          {
            name: 'Expected',
            type: 'funnel',
            left: '10%',
            width: '80%',
            label: {
              formatter: '{b}Expected'
            },
            labelLine: {
              show: false
            },
            itemStyle: {
              opacity: 0.7
            },
            emphasis: {
              label: {
                position: 'inside',
                formatter: '{b}Expected: {c}%'
              }
            },
            data: [
              { value: 60, name: 'Visit' },
              { value: 40, name: 'Inquiry' },
              { value: 20, name: 'Order' },
              { value: 80, name: 'Click' },
              { value: 100, name: 'Show' }
            ]
          },
          {
            name: 'Actual',
            type: 'funnel',
            left: '10%',
            width: '80%',
            maxSize: '80%',
            label: {
              position: 'inside',
              formatter: '{c}%',
              color: '#fff'
            },
            itemStyle: {
              opacity: 0.5,
              borderColor: '#fff',
              borderWidth: 2
            },
            emphasis: {
              label: {
                position: 'inside',
                formatter: '{b}Actual: {c}%'
              }
            },
            data: [
              { value: 30, name: 'Visit' },
              { value: 10, name: 'Inquiry' },
              { value: 5, name: 'Order' },
              { value: 50, name: 'Click' },
              { value: 80, name: 'Show' }
            ],
            // Ensure outer shape will not be over inner shape when hover.
            z: 100
          }
        ]
      };

    // 步骤5：使用刚指定的配置项和数据显示图表
    myChart.setOption(option)

    // window.onresize = () => {
    //     myChart.resize()
    // }   

    window.addEventListener('resize', () => {
        myChart.resize()
    })
})()